#set($lentityName = "${entityName.substring(0, 1).toLowerCase()}${entityName.substring(1)}")

import {computed, defineComponent, onMounted, reactive, ref} from "vue";
import {SlashPanel,JsonUtil, SlashAppContext} from "slash-web";
import {SlashPanelBody} from "slash-web";
import {SlashPanelHeader} from "slash-web";
import {SlashPagination} from "slash-web";
import AuthTbRoleUpdate from './AuthTbRoleUpdate.vue'
import {ApiResponse, ListResponse} from "slash-web";
import {Layer} from "slash-layer";
// @ts-ignore
import {FormConfigure} from "slash-layer";
import ${entityName}Update from './${entityName}Update.vue'
import {FormConfigure} from "slash-layer/dist/packages/components/Layer/ts/LayerConfigureDefinition";
import ${lentityName}Api from "./${entityName}Api";
import {Select${entityName}PageListQueryParam,${entityName}Response} from "./${entityName}Api";


export default defineComponent({
    name: 'userList',
    components: {
        SlashPanelBody,
        SlashPanel,
        SlashPanelHeader,
        SlashPagination
    },
    setup() {
        const restQueryParam = {
            searchKey: '',
            currentPage: 1,
            pageSize: 10,
        }
        const queryParamRef = ref <Select${entityName}PageListQueryParam > (JsonUtil.copyProperties(restQueryParam))
        const multipleSelectionRef = ref<any[]>([])

        const viewConfRea = reactive({
            tableLoading: false,
            tableListTotal: 0,
            editBtn: computed(() => {
                return multipleSelectionRef.value.length == 1;
            }),
            delBtn: computed(() => {
                return multipleSelectionRef.value.length > 0;
            }),
            importBtn: computed(() => {
                return false;
            }),
            exportIdsBtn: computed(() => {
                return false && multipleSelectionRef.value.length > 0;
            }),
            exportWhereBtn: computed(() => {
                return false;
            })
        })

        const tableListRef = ref<${entityName}Response[]>([]);
        const onDeleteBtnEvent = (row: ${entityName}Response) => {
            console.log("删除:", row);
            let ids: any[] = [];
            if (row.id) {
                ids.push(row.id);
            } else {
                ids = multipleSelectionRef.value.map(it => {
                    return it.id
                });
            }
            console.log(ids);
            doDelete(ids);
        }
        const onUpdateBtnEvent = (row: any) => {
            if (row) {
                doAddOrUpdate(row);
            } else {
                console.log("选中的参数:", multipleSelectionRef.value);
                doAddOrUpdate(multipleSelectionRef.value[0]);
            }
        }
        const doDelete = (row: any) => {
            Layer.confirm("您确定删除选中数据？").then((rs) => {${lentityName}Api.doLogicDelete${entityName}
                (row).then((r: ApiResponse<any>) => {
                    Layer.success(r.msg);
                }).catch((r: ApiResponse<any>) => {
                    Layer.error(r.msg);
                }).finally(() => {
                    doSearchList();
                })
            })
        }
        /**
         * 选中列表
         * @param rows
         */
        const onCheckedRow = (rows: any[]) => {
            console.log("选中");
            multipleSelectionRef.value = rows;
        }
        const onPageChangeEvent = (data: any) => {
            queryParamRef.value.currentPage = data.currentPage;
            queryParamRef.value.pageSize = data.pageSize;
            doSearchList();
        }
        const doAddOrUpdate = (row: any) => {
            console.log("参数", row);
            if (row) {
                Layer.updateForm({
                    title: "修改",
                    content: {
                        component: ${entityName}Update,
                        props: {
                            ...row
                        }
                    }
                    //@ts-ignore
                } as FormConfigure).then(res => {
                    doSearchList();
                })

            } else {
                Layer.createForm({
                    title: "新增",
                    content: {
                        component: ${entityName}Update,
                        props: {}
                    }

                } as FormConfigure).then(res => {
                    doSearchList();
                })
            }

        }
        const doReset = () => {
            queryParamRef.value = JsonUtil.copyProperties(restQueryParam);
            doSearchList();
        }

        const doSearchList = () => {
            viewConfRea.tableLoading = true;
            ${lentityName}Api.select${entityName}PageList(queryParamRef.value).then((msg: ListResponse<${entityName}Response>) => {
                tableListRef.value = msg.data;
                queryParamRef.value.currentPage = msg.currentPage;
                queryParamRef.value.pageSize = msg.pageSize;
                viewConfRea.tableListTotal = msg.total;
            }).finally(() => {
                viewConfRea.tableLoading = false;
            })

        }
        onMounted(() => {
            doSearchList();
        })
        return {
            queryParamRef,
            tableListRef,
            viewConfRea,
            doSearchList,
            doDelete,
            onDeleteBtnEvent,
            doReset,
            doAddOrUpdate,
            onUpdateBtnEvent,
            onCheckedRow,
            onPageChangeEvent
        };
    }

})
